<template>
  <!-- 人才简历 -->
  <view class="box" @click="external" style="background: #eff1f3">
    <view class="tou top" :style="'padding-top:' + statusBarHeight1 + 'px'">
      <image
        @click.stop="fanhui"
        class="image1"
        src="https://pic.bangbangtongcheng.com/static/fanhui_bai.png"
      />
      <!-- #ifndef MP-WEIXIN -->
      人才简历
      <!-- #endif -->
      <!-- #ifdef MP-WEIXIN -->
      <text @click="fanhui" style="position: absolute; left: 50%; transform: translateX(-50%)"
        >人才简历</text
      >
      <!-- #endif -->
    </view>
    <view class="tit">
      <view class="xuan view">推荐人才</view>
      <view class="tit_right">
        <view class="sai" @click.stop="showModal" data-target="DrawerModalR">
          筛选
          <span>▼</span>
        </view>
      </view>
    </view>
    <view
      class="tit_list"
      :style="'height: calc(100vh - 88rpx - 120rpx - ' + statusBarHeight1 + 'px);'"
    >
      <scroll-view
        class="scroll-view"
        :scroll-y="modalName == '' || modalName == null"
        @scrolltolower="down"
        :scroll-top="scrollTop1"
        @scroll="scroll"
        refresher-background="#f5f5f5"
      >
        <view
          class="resume"
          v-for="(item, index) in Recommend"
          :key="item.id"
          @click="details(item)"
        >
          <view class="resumeTop">
            <view class="avatar">
              <image :src="item.myPhoto || ''" mode="aspectFill"></image>
            </view>
            <view class="resumeInfo">
              <view class="nameInfo">
                <span class="realName">{{ item.realName }}</span>
                <span v-if="item.age">{{ item.age ? item.age + '岁' : '' }}</span>
                <span v-if="item.highestEducation">{{
                  item.highestEducation ? '学历：' + item.highestEducation : ''
                }}</span>
                <span v-if="item.experienceYears">{{
                  item.experienceYears ? '工作经验：' + item.experienceYears : ''
                }}</span>
              </view>
              <view class="workInfo" v-if="item.intendedPosition">
                期望工作：
                <span class="label" v-for="(i, j) in item.intendedPosition.split(',')" :key="j">
                  {{ i }}
                </span>
              </view>
            </view>
          </view>
          <view class="resumeBottom" v-if="item.personalAdvantages">
            自我介绍：{{ item.personalAdvantages || '' }}
          </view>
          <!-- 					<view :class="item.active ? 'activeColor title' : 'title'">{{ item.resumeTitle }}</view>
					<view :class="item.active ? 'activeColor occupation' : 'occupation'">
						<span class="occupation_text" :class="item.active ? 'activeColor' : ''" :key="index1"
							v-for="(item1, index1) in item.intendedPosition.split(',')">{{ item1 }}</span>
					</view>
					<view :class="item.active ? 'activeColor hands-on' : 'hands-on'">
						<span :class="item.active ? 'activeColor' : ''">{{ item.experienceYears }}工作经验·</span>
						<span :class="item.active ? 'activeColor' : ''">{{ item.highestEducation.split(" ")[0] }}</span>
					</view>
					<view :class="item.active ? 'activeColor individual' : 'individual'">
						<view :class="item.active ? 'activeColor individual_left' : 'individual_left'">
							<view :class="item.active ? 'activeColor name' : 'name'">
								{{
                  item.userInformation.nikeName
                    ? item.userInformation.nikeName
                    : "未命名用户"
                }}
							</view>
							<text :class="item.active ? 'activeColor vip-rank' : 'vip-rank'" :style="{
                  color: $member.colors()[item.userInformation.memberLevel - 1].wordColor,
                  backgroundColor: $member.colors()[item.userInformation.memberLevel - 1]
                    .bgColor,
                  borderColor: $member.colors()[item.userInformation.memberLevel - 1]
                    .lineColor,
                }">
								{{ item.memberTitle }}
							</text>
						</view>
						<view v-if="item.latitude"
							:class="item.active ? 'activeColor individual_right' : 'individual_right'">
							{{ item.distance }}km
						</view>
					</view> -->
        </view>
        <view v-if="Recommend.length == 0" class="none">
          <image src="https://pic.bangbangtongcheng.com/static/none.png" mode="widthFix" />
          <view>没有更多数据了</view>
        </view>
        <view class="down" v-show="Recommend.length != 0 && !downStatus">没有更多了</view>
      </scroll-view>
    </view>
    <view
      class="cu-modal drawer-modal justify-end"
      style="z-index: 999"
      :class="modalName == 'DrawerModalR' ? 'show' : ''"
    >
      <scroll-view scroll-y="true" class="pop-scroll">
        <view class="tittit" :style="[{ top: 'calc(' + CustomBar1 + 'px' + ' + 36px )' }]">
          <view @click="hideModal()">×</view>筛选
        </view>
        <view
          class="cu-dialog basis-lg"
          @tap.stop
          :style="[
            {
              top: 'calc(' + CustomBar1 + 'px' + ' + 36px )',
              height: 'calc(100vh - ' + CustomBar1 + 'px - 36px)',
            },
          ]"
        >
          <view class="cu-list menu text-left">
            <view style="height: 80rpx"></view>
            <view class="leibie" style="display: flex; align-items: center">
              距离
              <view class="select">
                <uni-data-select
                  v-model="data.distance"
                  placeholder="请选择"
                  :clear="false"
                  :localdata="type11"
                ></uni-data-select>
              </view>
            </view>
            <view class="leibie" style="display: flex; align-items: center">
              发布日期
              <view class="select">
                <uni-data-select
                  v-model="data.releaseDate"
                  placeholder="请选择"
                  :clear="false"
                  :localdata="typerq"
                ></uni-data-select>
              </view>
              天内
            </view>
            <view class="position">
              <view class="position_top" @click="positionCategory()">
                <view class="title"> 职位分类 </view>
                <image
                  class="image"
                  src="https://pic.bangbangtongcheng.com/static/bbzc/sx_yjt.png"
                  mode=""
                ></image>
              </view>
              <view class="list" v-if="ZWLX.length">
                <view class="lable" v-for="(i, j) in ZWLX" :key="j">
                  {{ i.split(',')[2] }}
                  <view class="close" @click="close(i)">
                    <image
                      class="image"
                      src="https://pic.bangbangtongcheng.com/static/bbzc/sx_close.png"
                      mode=""
                    >
                    </image>
                  </view>
                </view>
              </view>
            </view>
            <view class="leibie">
              学历要求
              <span style="font-size: 24rpx; font-weight: 400; color: #adadad">*可多选</span>
              <view class="list">
                <view
                  @click.stop="typeClick3(index)"
                  :class="item.active ? 'li xuan' : 'li'"
                  v-for="(item, index) in type3"
                  :key="index"
                  >{{ item.valueName }}</view
                >
              </view>
            </view>
            <view class="leibie">
              年龄
              <view class="timeInterval">
                <view class="xbRadio">
                  <view class="radio" @click.stop="tabClickage(1)">
                    <view class="radio_item" :class="!minAge && !maxAge ? 'radioxz' : ''"></view>
                    <span>不限</span>
                  </view>
                </view>
                <view class="selector">
                  <view class="selects">
                    <uni-data-select
                      v-model="minAge"
                      placeholder="请选择"
                      @change="change"
                      :clear="false"
                      :localdata="typeNL"
                    ></uni-data-select>
                  </view>
                  <view style="margin: 0 16rpx; font-size: 34rpx">至</view>
                  <view class="selects">
                    <uni-data-select
                      v-model="maxAge"
                      placeholder="请选择"
                      @change="change"
                      :clear="false"
                      :localdata="typeNL"
                    ></uni-data-select>
                  </view>
                </view>
              </view>
            </view>
            <view class="leibie">
              工作经验
              <view class="list">
                <view
                  @click.stop="typeClick(index, 'type2')"
                  :class="item.active ? 'li xuan' : 'li'"
                  v-for="(item, index) in type2"
                  :key="index"
                  >{{ item.valueName }}</view
                >
              </view>
            </view>
            <view class="leibie">
              薪资范围
              <view class="salaryRange">
                <view class="inputs">
                  <input
                    class="input"
                    v-model="minimumWage"
                    @input="inputChage1"
                    placeholder="最低薪资"
                    type="digit"
                  />元
                </view>
                <span class="span">-</span>
                <view class="inputs">
                  <input
                    class="input"
                    v-model="maximumSalary"
                    @input="inputChage2"
                    placeholder="最高薪资"
                    type="digit"
                  />元
                </view>
                <view class="qued" @click="define"> 确定 </view>
              </view>
            </view>
          </view>
        </view>
        <view class="di">
          <view class="div l" @click.stop="cz">重置</view>
          <view class="div r" @click.stop="sx">确定</view>
        </view>
      </scroll-view>
    </view>
    <view v-if="scrollTop > 0" class="hui" @click.stop="totop">
      <image src="https://pic.bangbangtongcheng.com/static/top.png" />返回顶部
    </view>
    <uniBall></uniBall>
  </view>
</template>

<script>
  import permision from '@/js_sdk/wa-permission/permission.js'
  import { mapGetters } from 'vuex'
  //#ifdef H5
  import wxshare from '../../utils/index.js'
  //#endif
  export default {
    data() {
      return {
        Recommend: [],
        imgUrl: this.$imgSrc,
        scrollTop: '0',
        scrollTop1: '0',
        trigger: false,
        downStatus: true,
        upStatus: true,
        CustomBar1: '',
        userInfo: uni.getStorageSync('Pduser'),
        viewHight: '',
        modalName: '',
        data: {
          publisherId: '',
          pageNo: 1,
          pageSize: 10,
          longitude: '', //经度
          latitude: '', //纬度
          distance: '', //距离
          highestEducation: '', //学历要求
          intendedPosition: '', //意向职位
          dateBirth: '', //年龄
          workExperience: '', //工作经验
          salaryExpectation: '', //薪资范围
          releaseDate: '', //发布日期
        },
        // 职位类型
        ZWLX: [],
        typerq: [],
        type11: [
          {
            value: '',
            text: '不限',
          },
        ],
        type3: [
          {
            active: true,
            valueName: '不限',
          },
        ],
        type2: [
          {
            active: true,
            valueName: '不限',
          },
        ],
        typeNL: [],
        // 年龄
        ages: 1,
        minAge: '', // 25,
        maxAge: '', // 40,
        minimumWage: '',
        maximumSalary: '',
        indexss: 0,
      }
    },
    computed: {
      ...mapGetters(['statusBarHeight1', 'userinfo']),
    },
    filters: {
      nums(val) {
        return val.toFixed(2)
      },
    },
    async onLoad(options) {
      // await this.getLocation();
      this.getType()
      this.age()
      this.CustomBar1 = this.CustomBar
      /* #ifdef H5 */
      this.jinzhi()
      /* #endif */
    },
    onShow() {
      if (this.indexss == 1) {
        this.indexss = 0
        this.Recommend = []
        this.data.pageNo = 1
        this.getRecommend()
      }
    },
    onPageScroll: function (Object) {
      this.scrollTop = Object.scrollTop
    },
    async onPullDownRefresh() {
      this.Recommend = []
      this.data.pageNo = 1
      this.downStatus = true
      if (this.upStatus) {
        this.trigger = true
        await this.getRecommend()
      }
    },
    methods: {
      // 获取年龄
      age() {
        for (let i = 18; i <= 70; i++) {
          this.typeNL.push({
            value: i,
            text: i,
          })
        }
      },
      change(e) {
        // this.ages = 0;
      },
      positionCategory() {
        this.ZWLX && uni.setStorageSync('zwlbss_key', this.ZWLX)
        uni.navigateTo({
          url: '/pages_recruitMoney/recruitmentInformation/selectPositionCategory?index=1',
        })
      },
      tabClickage(index) {
        this.ages = 1
        this.minAge = ''
        this.maxAge = ''
        console.log(this.ages)
      },
      close(j) {
        let index = this.ZWLX.indexOf(j)
        this.ZWLX.splice(index, 1)
      },
      scroll(e) {
        this.oldScrollTop = e.detail.scrollTop
        this.scrollTop = e.detail.scrollTop
      },
      cz() {
        this.type2.forEach((v) => {
          if (v.valueName == '不限') {
            v.active = true
          } else {
            v.active = false
          }
        })
        this.type3.forEach((v) => {
          if (v.valueName == '不限') {
            v.active = true
          } else {
            v.active = false
          }
        })
        this.minAge = ''
        this.maxAge = ''
        this.ages = '1'
        this.minimumWage = ''
        this.maximumSalary = ''
        this.data.distance = ''
        this.data.highestEducation = ''
        this.data.intendedPosition = ''
        this.data.dateBirth = ''
        this.data.workExperience = ''
        this.data.salaryExpectation = ''
        this.data.releaseDate = ''
        this.ZWLX = []
        this.data.pageNo = 1
        this.Recommend = []
        this.downStatus = true
        console.log(this.ages)
        this.getRecommend()
      },
      // 点击会员
      goMyLevel() {
        uni.navigateTo({
          url: '/pages_my/bangClub',
        })
      },
      jinzhi() {
        let _this = this
        let param = window.location.href.split('#')[0]
        uni.request({
          method: 'post',
          data: {
            url: param,
          },
          header: {
            'content-type': 'application/x-www-form-urlencoded',
          },
          url: 'https://www.bangbangtongcheng.com/conven//mob/login/getJsTicket.do',
          success(re) {
            _this.jinzhifx(re.data)
          },
        })
      },
      jinzhifx(data) {
        wxshare.config({
          debug: false, //是否打开调试
          appId: data.appId, // 公众号的唯一标识
          timestamp: data.timestamp, // 生成签名的时间戳
          nonceStr: data.nonce, // ，生成签名的随机串
          signature: data.signature, // 签名
          jsApiList: ['hideMenuItems'],
        })
        // 禁止分享
        wxshare.hideMenuItems({
          // 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
          menuList: [
            'menuItem:share:appMessage',
            'menuItem:share:timeline',
            'menuItem:share:timeline',
            'menuItem:share:qq',
            'menuItem:favorite',
            'menuItem:share:QZone',
            'menuItem:openWithSafari',
          ],
        })
      },
      totop() {
        this.scrollTop1 = this.oldScrollTop
        this.$nextTick(() => {
          this.scrollTop1 = 0
        })
      },
      sx() {
        if (this.minAge || this.maxAge) {
          this.ages = 0
        }
        let that = this
        // 点确定时调用一次确认薪资
        if (this.define() === false) return
        //学历要求
        let arr = []
        this.type3.forEach((v, j) => {
          if (v.active) {
            if (v.valueName == '不限') {
              this.data.highestEducation = ''
            } else {
              arr.push(v.valueName)
            }
          }
          this.data.highestEducation = arr.join(',')
        })
        //意向职位
        let zwflArr = []
        this.ZWLX.forEach((v) => {
          zwflArr.push(v.split(',')[2])
        })
        this.data.intendedPosition = zwflArr.join(',')
        // 年龄
        console.log(this.ages)
        if (this.ages == 1) {
          this.data.dateBirth = ''
        } else {
          if (this.minAge == '' || this.maxAge == '') {
            uni.showToast({
              title: '请选择年龄',
              icon: 'none',
              mask: true,
            })
            return
          }
          if (this.minAge > this.maxAge) {
            uni.showToast({
              title: '最小年龄不能高于最大年龄',
              icon: 'none',
              mask: true,
            })
            return
          }
          this.data.dateBirth = this.minAge + ',' + this.maxAge
        }
        // 工作经验
        this.type2.forEach((v, j) => {
          if (v.active) {
            if (v.valueName == '一年以内') {
              this.data.workExperience = '1年以内'
            } else {
              this.data.workExperience = v.valueName == '不限' ? '' : v.valueName
            }
          }
        })
        this.Recommend = []
        this.data.pageNo = 1
        this.downStatus = true
        this.modalName = null
        this.getRecommend()
      },
      getType() {
        let that = this
        this.$myRequest
          .get('/api/mobile/personnelOwner/queryDataDictionaryList', {
            type: '2,3,11',
          })
          .then((res) => {
            res.dataDictionaryList.forEach((el) => {
              el.active = false
              if (el.type == 11) {
                that.type11.push({
                  value: el.valueName,
                  text: el.valueName,
                })
              } else if (el.type == 3) {
                that.type3.push(el)
              } else if (el.type == 2) {
                that.type2.push(el)
              }
            })
            for (var i = 5; i <= 30; i += 5) {
              this.typerq.push({
                value: i,
                text: i,
              })
            }
          })
      },
      typeClick(index, type) {
        let that = this
        this[type].forEach((el, index1) => {
          if (index == index1) {
            that.$set(that[type][index1], 'active', !el.active)
          } else {
            that[type][index1].active = false
          }
        })
      },
      typeClick3(index) {
        let that = this
        if (index) {
          that.$set(that.type3[0], 'active', false)
          this.type3.forEach((el, index1) => {
            if (index == index1) {
              that.$set(that.type3[index1], 'active', !el.active)
            }
          })
        } else {
          this.type3.forEach((el, index1) => {
            if (index == index1) {
              that.$set(that.type3[index1], 'active', !el.active)
            } else {
              that.type3[index1].active = false
            }
          })
        }
      },
      sousuo() {
        // if (!this.userinfo.phone) {
        //   uni.showToast({
        //     title: "请登录",
        //     icon: "none",
        //     mask: true,
        //   });
        //   return;
        // }
        uni.navigateTo({
          url: '/pages_houses/housing/oldHouseSearch?searchlogType=1&type=2',
        })
      },
      details(item) {
        uni.navigateTo({
          url: '/pages_recruitMoney/recruitmentDetails/resumeDetails?id=' + item.id + '&indexss=1',
        })
        this.Recommend.forEach((v) => {
          if (v.id == item.id) {
            v.active = true
          }
        })
      },
      showModal(e) {
        this.modalName = e.currentTarget.dataset.target
        uni.stopPullDownRefresh()
      },
      down() {
        if (this.downStatus) {
          this.data.pageNo++
          this.getRecommend()
        }
      },
      async up() {
        this.Recommend = []
        this.data.pageNo = 1
        this.downStatus = true
        if (this.upStatus) {
          this.trigger = true
          await this.getRecommend()
        }
      },
      getRecommend() {
        this.upStatus = false
        this.data.publisherId = this.userInfo.id
        this.$myRequest
          .get('/api/mobile/personnelOwner/getAllRecommendedResumeTabulation', this.data)
          .then((res) => {
            uni.hideLoading()
            if (!res.recommendedResumeTabulation.length) {
              this.downStatus = false
            }
            console.log('this.downStatus', this.downStatus)
            this.upStatus = true
            this.trigger = false
            res.recommendedResumeTabulation.pageList.forEach((v) => {
              v.active = false
            })
            this.Recommend = this.Recommend.concat(res.recommendedResumeTabulation.pageList)
            uni.stopPullDownRefresh()
          })
      },
      hideModal(e) {
        this.modalName = null
      },
      external() {
        this.modalName = null
      },
      fanhui() {
        uni.navigateBack({
          delta: 1,
        })
      },
      async getLocation() {
        this.getLocation1()
      },
      getLocation1() {
        uni.showLoading({
          title: '加载中',
          mask: true,
        })
        let _this = this
        uni.getLocation({
          type: 'gcj02',
          highAccuracyExpireTime: '3000',
          success(res) {
            _this.data.latitude = res.latitude
            _this.data.longitude = res.longitude
            _this.getRecommend()
          },
          fail:(res) => {
            console.log(res, '经纬度没有授权');
            this.$SHOWMODAL_TO_SETTINGS();
            uni.setStorageSync('locationState', 0)
            if (uni.getStorageSync('locationState') == 0) {
              // uni.showModal({
              //   title: '提示',
              //   content: '您已关闭位置权限或获取位置信息失败',
              //   success: function (res) {
              //     if (res.confirm) {
              //       // plus.runtime.openURL("app-settings:");
              //       if (plus.os.name === 'iOS') {
              //         plus.runtime.openURL('app-settings://')
              //       } else {
              //         var Intent = plus.android.importClass('android.content.Intent')
              //         var Settings = plus.android.importClass('android.provider.Settings')
              //         var Uri = plus.android.importClass('android.net.Uri')
              //         var mainActivity = plus.android.runtimeMainActivity()
              //         var intent = new Intent()
              //         intent.setAction(Settings.ACTION_APPLICATION_DETAILS_SETTINGS)
              //         var uri = Uri.fromParts('package', mainActivity.getPackageName(), null)
              //         intent.setData(uri)
              //         mainActivity.startActivity(intent)
              //       }
              //     } else if (res.cancel) {
              //       console.log('用户点击取消')
              //     }
              //   },
              // })
              return false
            }
          },
        })
      },
      // 金额校验
      inputChage1(e) {
        let length = 6
        // 数值中转
        let temp = e.target.value
        //  正则限制 3.. 以及 3.3.3的情况
        if (temp) {
          temp = temp
            .replace(/[^0-9.]|^\.|\.{2,}/g, '')
            .replace('.', '$#$')
            .replace(/\./g, '')
            .replace('$#$', '.')
          const point = temp.split('.')
          let decimals // 整数部分
          let positiveInteger // 小数部分
          // 先处理整数部分
          if (point[0]) {
            decimals = point[0].length > length ? point[0].slice(0, length) : point[0]
          }
          if (point[0].length > 1 && point[0].slice(0, 1) == '0') {
            decimals = point[0].slice(1, 2)
          }
          //  处理小数部分
          if (temp.includes('.')) {
            positiveInteger = point[1].length > 2 ? point[1].slice(0, 2) : point[1]
            temp = positiveInteger ? `${decimals}.${positiveInteger}` : `${decimals}.`
          } else {
            temp = decimals
          }
        }
        this.$nextTick(function () {
          this.minimumWage = temp
        })
      },
      inputChage2(e) {
        let length = 6
        // 数值中转
        let temp = e.target.value
        //  正则限制 3.. 以及 3.3.3的情况
        if (temp) {
          temp = temp
            .replace(/[^0-9.]|^\.|\.{2,}/g, '')
            .replace('.', '$#$')
            .replace(/\./g, '')
            .replace('$#$', '.')
          const point = temp.split('.')
          let decimals // 整数部分
          let positiveInteger // 小数部分
          // 先处理整数部分
          if (point[0]) {
            decimals = point[0].length > length ? point[0].slice(0, length) : point[0]
          }
          if (point[0].length > 1 && point[0].slice(0, 1) == '0') {
            decimals = point[0].slice(1, 2)
          }
          //  处理小数部分
          if (temp.includes('.')) {
            positiveInteger = point[1].length > 2 ? point[1].slice(0, 2) : point[1]
            temp = positiveInteger ? `${decimals}.${positiveInteger}` : `${decimals}.`
          } else {
            temp = decimals
          }
        }
        this.$nextTick(function () {
          this.maximumSalary = temp
        })
      },
      define() {
        if (this.maximumSalary == '' && this.minimumWage == '') {
          this.data.salaryExpectation = ''
        } else if (this.maximumSalary != '' && this.minimumWage != '') {
          if (Number(this.maximumSalary) < Number(this.minimumWage)) {
            uni.showToast({
              title: '最低薪资不能大于最高薪资',
              icon: 'none',
              mask: true,
            })
            return false
          }
          this.data.salaryExpectation = this.minimumWage + '-' + this.maximumSalary
        } else {
          uni.showToast({
            title: '薪资请勿只填最低或最高',
            icon: 'none',
            mask: true,
          })
          return false
        }
      },
    },
  }
</script>

<style lang="less" scoped>
  .tittit {
    position: fixed;
    top: 0;
    right: 0;
    background-color: #f8f8f8;
    z-index: 9999;
    max-width: 100%;
    width: 600rpx;
    transition-duration: 0.3s;
    transform: translateX(100%);

    text-align: center;
    line-height: 80rpx;
    font-size: 30rpx;
    border-bottom: 2rpx solid #cccccc;

    view {
      position: absolute;
      top: 0rpx;
      left: 20rpx;
      color: #999999;
      font-size: 54rpx;
      font-weight: 100;
    }
  }

  .show .tittit {
    transform: translateX(0%);
  }

  .selector {
    display: flex;
    align-items: center;

    .selects {
      width: 140rpx;
    }

    .selector_item {
      width: 160rpx;
      height: 60rpx;
      background-color: #ffffff;
      border-radius: 8rpx;
      border: 1px solid #999999;
      display: flex;
      align-items: center;
      justify-content: space-evenly;
      font-size: 26rpx;
      font-weight: 500;
      color: #333333;

      .image {
        width: 22rpx;
        height: 22rpx;
      }
    }
  }

  .xbRadio {
    display: flex;
    align-items: center;

    .radio {
      width: 130rpx;
      display: flex;
      align-items: center;
      margin-right: 0;

      .radio_item {
        width: 36rpx;
        height: 36rpx;
        border: 1px solid #c9c9c9;
        border-radius: 36rpx;
        margin-right: 14rpx;
      }

      span {
        font-size: 28rpx;
        font-weight: 500;
        color: #333333;
      }

      .radioxz {
        border: 1px solid #64b6a8;
        position: relative;
      }

      .radioxz::before {
        content: '';
        width: 24rpx;
        height: 24rpx;
        border-radius: 24rpx;
        background-color: #64b6a8;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
      }
    }
  }

  .cu-list {
    min-height: 100%;
    padding-bottom: calc(98rpx + env(safe-area-inset-bottom) / 2);
    background-color: #fff;

    .leibie {
      margin-top: 40rpx;
      font-size: 28rpx;
      margin-left: 40rpx;
      margin-right: 20rpx;

      .select {
        width: 224rpx;
        margin-left: 20rpx;
      }

      .timeInterval {
        display: flex;
        align-items: center;
      }

      .salaryRange {
        display: flex;
        align-items: center;

        .inputs {
          width: 160rpx;
          display: flex;
          align-items: center;
          font-size: 28rpx;
          font-weight: 500;
          color: #333333;

          .input {
            font-size: 24rpx;
            height: 58rpx;
            border-bottom: 1px solid #e0e0e0;
            margin-right: 10rpx;
          }
        }

        .span {
          margin: 0 10rpx;
        }

        .qued {
          width: 120rpx;
          height: 58rpx;
          background-color: #64b6a8;
          border-radius: 4rpx;
          font-size: 28rpx;
          font-weight: 400;
          color: #ffffff;
          display: flex;
          align-items: center;
          justify-content: center;
          margin-left: 20rpx;
        }
      }

      .list {
        width: 100%;
        margin-top: 24rpx;
        display: flex;
        align-items: center;
        flex-wrap: wrap;

        .li {
          min-width: 90rpx;
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 10rpx 20rpx;
          background: #f2f2f2;
          border-radius: 30rpx;
          margin-right: 24rpx;
          margin-bottom: 24rpx;
        }

        .xuan {
          background: #64b6a8;
          color: #fff;
        }
      }
    }

    .position {
      margin-top: 40rpx;
      font-size: 28rpx;
      margin-left: 40rpx;
      margin-right: 20rpx;

      .position_top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16rpx;

        .title {
          font-weight: 400;
        }

        .image {
          width: 40rpx;
          height: 40rpx;
        }
      }

      .list {
        display: flex;
        align-items: center;
        flex-wrap: wrap;

        .lable {
          font-size: 26rpx;
          font-weight: 400;
          color: #64b6a8;
          padding: 6rpx 20rpx;
          border: 1px solid #64b6a8;
          position: relative;
          border-radius: 6rpx;
          margin-right: 20rpx;
          margin-right: 14rpx;

          .close {
            width: 20rpx;
            height: 20rpx;
            position: absolute;
            top: 0;
            right: 0;
            display: flex;
            align-items: center;
            justify-content: center;

            .image {
              width: 18rpx;
              height: 18rpx;
            }
          }
        }
      }
    }
  }

  .zbc {
    position: fixed;
    width: 100%;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 99999;
  }

  .box {
    width: 100%;
    min-height: 100vh;
    background-color: #fff;
  }

  .tou {
    position: relative;
    width: 100%;
    text-align: center;
    line-height: 88rpx;
    font-size: 36rpx;
    color: #fff;
    background-color: #64b6a8;
    /* #ifdef MP-WEIXIN */
    text-align: left;
    display: flex;
    align-items: center;

    /* #endif */
    .image1 {
      position: absolute;
      width: 32rpx;
      height: 32rpx;
      left: 30rpx;
    }

    .image2 {
      position: absolute;
      width: 56rpx;
      height: 56rpx;
      // top: 28rpx;
      /* #ifdef MP-WEIXIN */
      position: initial;
      margin-left: auto;
      margin-right: 200rpx;
      /* #endif */
      bottom: 16rpx !important;
      right: 30rpx;
      // #ifdef APP
      // top: 50%;
      // #endif
    }
  }

  .tit {
    margin: 0 30rpx;
    height: 120rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;

    .view {
      font-size: 36rpx;
      font-weight: 550;
      color: #18a291;
    }

    .tit_right {
      display: flex;
      align-items: center;

      .sort {
        font-size: 32rpx;
        margin-right: 26rpx;
        position: relative;

        span {
          margin-left: 8rpx;
          font-size: 20rpx;
        }

        .administrations {
          width: 210rpx;
          height: 240rpx;
          background-color: #fff;
          position: absolute;
          right: 0rpx;
          bottom: -260rpx;
          box-shadow: 0px 0px 20px 1px #d0d0d0;
          z-index: 100;
          padding: 0 32rpx;
          display: flex;
          flex-direction: column;

          .items {
            height: 94rpx;
            color: #5a5e66;
            font-size: 28rpx;
            border-bottom: 1px solid #e0e0e0;
            display: flex;
            align-items: center;
            justify-content: center;
          }

          &::before {
            content: '';
            display: inline-block;
            border-left: 24rpx solid transparent;
            border-right: 20rpx solid transparent;
            border-bottom: 24rpx solid #fff;
            position: absolute;
            right: 12rpx;
            top: -22rpx;
          }
        }
      }

      .sai {
        font-size: 32rpx;

        span {
          margin-left: 8rpx;
          font-size: 20rpx;
        }
      }
    }
  }

  .tit_list {
    width: 710rpx;
    margin: 0rpx auto;

    .resume {
      width: 100%;
      margin-bottom: 20rpx;
      background: linear-gradient(180deg, #ecf9ff 0%, #ffffff 100%);
      border-radius: 20rpx;
      border: 1rpx solid #f1f5f5;
      padding: 30rpx;
      font-size: 24rpx;

      .resumeTop {
        display: flex;
        align-items: center;

        .avatar {
          width: 92rpx;
          height: 92rpx;
          margin-right: 20rpx;
          border-radius: 50%;
          overflow: hidden;

          image {
            width: 92rpx;
            height: 92rpx;
          }
        }

        .resumeInfo {
          margin-bottom: 12rpx;

          .nameInfo {
            margin-bottom: 20rpx;

            .realName {
              font-weight: 500;
              font-size: 32rpx;
              color: #000000;
              margin-right: 13rpx;
            }

            span {
              margin-right: 30rpx;
            }
          }

          .workInfo {
            .label {
              display: inline-block;
              padding: 8rpx 15rpx;
              background: #f5f7f9;
              margin-right: 10rpx;
              font-size: 24rpx;
              font-weight: 400;
              color: #666666;
              border-radius: 4rpx;
            }

            .label:nth-last-child(1) {
              margin-right: 0rpx;
            }
          }
        }
      }

      .resumeBottom {
        overflow: hidden;
        text-overflow: clip;
        display: -webkit-box;
        line-break: anywhere;
        word-break: break-all;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
      }

      .activeColor {
        color: #adadad !important;
      }

      .title {
        font-size: 28rpx;
        font-weight: 550;
        color: #333333;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2; //想要的行数
        -webkit-box-orient: vertical;
        margin-bottom: 16rpx;
      }

      .occupation {
        display: flex;
        align-items: center;
        margin-bottom: 16rpx;

        span {
          font-size: 24rpx;
          font-weight: 400;
          color: #333333;
          margin-right: 16rpx;
        }

        span:nth-last-child(1) {
          margin-right: 0;
        }
      }

      .hands-on {
        display: flex;
        align-items: center;
        margin-bottom: 16rpx;

        span {
          font-size: 24rpx;
          font-weight: 400;
          color: #888888;
        }
      }

      .individual {
        display: flex;
        align-items: center;
        justify-content: space-between;

        .individual_left {
          display: flex;
          align-items: center;

          .name {
            font-size: 24rpx;
            font-weight: 400;
            color: #333333;
            margin-right: 10rpx;
          }

          .vip-rank {
            padding: 3rpx 10rpx;
            margin: 0 18rpx 0 0;
            background: #f6f0ff;
            border-radius: 6rpx 6rpx 6rpx 6rpx;
            opacity: 1;
            border: 2rpx solid #bd90d9;
            font-size: 24rpx;
            font-weight: 500;
            color: #bd90d9;
          }
        }

        .individual_right {
          font-size: 24rpx;
          font-weight: 400;
          color: #888888;
        }
      }
    }
  }

  .hui {
    position: fixed;
    right: 30rpx;
    bottom: 154rpx;
    display: flex;
    align-items: center;
    padding: 10rpx 20rpx;
    background-color: #fff;
    border-radius: 34rpx;
    font-size: 26rpx;
    box-shadow: 0px 0px 36rpx rgba(0, 0, 0, 0.16);

    image {
      width: 46rpx;
      height: 46rpx;
      margin-right: 18rpx;
    }
  }

  .cu-dialog {
    max-width: 100%;
    width: 600rpx;
  }

  .basis-lg {
    flex-basis: 600rpx;
    overflow: auto;
  }

  .pop-scroll {
    position: relative;
  }

  .di {
    position: absolute;
    transform: translateY(0rpx);
    width: 100%;
    bottom: 0;
    left: 75rpx;

    .div {
      padding-bottom: calc(env(safe-area-inset-bottom) / 2);
      height: calc(env(safe-area-inset-bottom) / 2 + 50px);
      display: inline-block;
      width: 300rpx;
      text-align: center;
      line-height: 98rpx;
      font-size: 30rpx;
    }

    .l {
      background: #e0e0e0;
    }

    .r {
      background: #64b6a8;
      color: #fff;
    }
  }

  .scroll-view {
    height: 100%;
  }

  .down {
    height: 60rpx;
    line-height: 60rpx;
    text-align: center;
  }

  .none {
    text-align: center;

    image {
      width: 430rpx;
      margin-bottom: 16rpx;
    }

    view {
      height: 40rpx;
      line-height: 40rpx;
      color: #666;
    }
  }
</style>
